<template>
	<view>
		<view>
			<view class="content">
				<view>
					<view class="" style="display: flex;justify-content: flex-start;flex-direction: row;border: none;height: auto;">
						<text>姓名</text>
						<text style="color: red;">*</text>
					</view>
					<input type="text" value="" placeholder="请输入" v-model="username" />
				</view>
				<view>
					<view class="" style="display: flex;justify-content: flex-start;flex-direction: row;border: none;height: auto;">
						<text>电话</text>
						<text style="color: red;">*</text>
					</view>
					<input type="text" value="" placeholder="请输入" v-model="tel" maxlength="11" />
				</view>
				<view v-show="isguan">
					<view class="" style="display: flex;justify-content: flex-start;flex-direction: row;border: none;height: auto;">
						<text>公司名称</text>
						<text style="color: red;">*</text>
					</view>
					<input type="text" value="" placeholder="请输入" v-model="com_name" />
				</view>
		<!-- 		<view>
					<text>电子邮箱</text>
					<input type="text" value="" placeholder="请输入" v-model="email" />
				</view> -->
				<view v-show="isguan">
					<text>所在地区</text>
					<input type="text" value="" placeholder="请输入" v-model="address" />
				</view>
				<view v-show="isguan">
					<text>选择分类</text>
					<picker @change="bindPickerChange" :range="array">
						<label class="pr38">{{array[index]}}</label>
					</picker>
				</view>
			</view>
			<view class="down" @click="xiazai">
				<view style="display: flex;align-items: center;">
					<image src="../../static/zhanhui/ziliao.png" style="width: 32upx;height: 32upx;"></image>
					<text style="margin-left: 20upx;">资料下载</text>
				</view>
				<image src="../../static/zhanhui/backk.png" mode="" style="width: 22upx;height: 22upx;"></image>
			</view>
			<view class="bttm" @click="baomings">确定</view>
		</view>
		<uni-popup ref="popup" type="dialog">
			<uni-popup-dialog mode="base" :duration="2000" :before-close="true" @close="close" @confirm="confirm"
				content="是否申请成为商家"></uni-popup-dialog>
		</uni-popup>
		<uni-popup ref="popups" type="dialog">
			<uni-popup-dialog mode="base" :duration="2000" :before-close="true" @close="closes" @confirm="confirms"
				content="是否前往登录页面"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userid: '',
				circle_id: '',
				array: [],
				shop_id: '',
				username: '',
				tel: '',
				com_name: '',
				email: '',
				address: '',
				index: 0,
				flId: '',
				tokenw: '',
				userInfo: {},
				title: '',
				isguan:false
			}
		},
		onLoad(option) {
			try {
				const value = uni.getStorageSync('token');
				const values = uni.getStorageSync('userInfo');
				if (value) {
					console.log(value);
					this.tokenw = value
					this.userInfo = values
				}
			} catch (e) {
				// error
			}
			this.circle_id = option.circle_id
			if(option.title){
				this.title = JSON.parse(option.title)
			}
			if (this.title == "参展") {
				this.isguan = true
			}else{
				this.isguan = false
			}
			uni.request({
				url: "http://dsx.cdzer.com/api/Circle/exhibition", //仅为示例，并非真实接口地址。
				data: {
					circle_id: option.circle_id
				},
				header: {
					'content-type': 'application/x-www-form-urlencoded',
				},
				method: 'POST',
				success: (res) => {
					console.log(res, "展会信息")
					this.zhinfo = res.data.data.circle_info
					this.fenlei = res.data.data.circle_class
					this.flId = res.data.data.circle_class[0].id
					if (this.fenlei.length > 0) {
						this.fenlei.forEach(item => {
							// console.log(item,"item")
							this.array.push(item.class_name)
						})
					}
				}
			});
			console.log(JSON.parse(this.userInfo),"this.userInfothis.userInfo")
			this.username = JSON.parse(this.userInfo).user_name
			this.tel = JSON.parse(this.userInfo).phone
		},
		methods: {
			opens() {
				// 通过组件定义的ref调用uni-popup方法 ,如果传入参数 ，type 属性将失效 ，仅支持 ['top','left','bottom','right','center']
				this.$refs.popups.open('center')
			},
			open() {
				// 通过组件定义的ref调用uni-popup方法 ,如果传入参数 ，type 属性将失效 ，仅支持 ['top','left','bottom','right','center']
				this.$refs.popup.open('center')
			},
			xiazai() {
				uni.navigateTo({
					url: `downzl?circle_id=${this.circle_id}`
				})
			},
			bindPickerChange: function(e) { //改变的事件名
				this.index = e.target.value //将数组改变索引赋给定义的index变量
				console.log(this.index, "ssdasad")
				this.flId = this.fenlei[0].id
			},
			confirm() {
				console.log("确定")
				uni.navigateTo({
					url: '/pagesB/personalSon/TradingType'
				})
			},
			confirms() {
				console.log("确定")
				uni.navigateTo({
					url: '/pagesB/login/login'
				})
			},
			close() {
				// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
				// ...
			 this.$refs.popup.close()
			},
			closes() {
				// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
				// ...
			 this.$refs.popups.close()
			},
			baomings() {
				console.log(this.title=="参展","踢踢踢踢踢")
				if (this.title == "参展") {
					this.baoming()
					// alert(1)
				} else {
					this.baomingd()
					// alert(2)
				}
			},
			baomingd() {
				try {
					const value = uni.getStorageSync('userInfo');
					if (value) {
						console.log(value, "6666666666666");
						this.userInfo = value
					} else {
						// uni.showToast({
						// 	title: '请先登录',
						// 	icon: 'none'
						// })
						this.opens()
					}
				} catch (e) {
					// error
				}
				var info = JSON.parse(this.userInfo)
				console.log(info, "infoinfoinfoinfo")

				if (this.username == '' || this.tel == '') {
					uni.showToast({
						title: '不能为空',
						icon: 'none'
					})
				} else {
					uni.request({
						url: "http://dsx.cdzer.com/api/Circle/activities_apply", //仅为示例，并非真实接口地址。
						data: {
							username: this.username,
							tel: this.tel,
							com_name: this.com_name,
							email: this.email,
							address: this.address,
							circle_class_id: this.flId,
							circle_id: this.circle_id,
							uid: info.id
						},
						header: {
							'content-type': 'application/x-www-form-urlencoded',
						},
						method: 'POST',
						success: (res) => {
							console.log(res, "包名")
							if (res.data.status == 200) {
								uni.showToast({
									title: res.data.mess
								})
								this.username = ''
								this.tel = ''
								this.com_name = ''
								this.email = ''
								this.address = ''
								setTimeout(()=>{
									uni.navigateBack({
										delta:1
									})
								},1000)
							} else {
								uni.showToast({
									title: res.data.mess,
									icon: 'none'
								})
							}
						}
					});
				}
			},
			baoming() {
				try {
					const value = uni.getStorageSync('userInfo');
					if (value) {
						console.log(value, "6666666666666");
						this.userInfo = value
					} else {
						// uni.showToast({
						// 	title: '请先登录',
						// 	icon: 'none'
						// })
						this.opens()
					}
				} catch (e) {
					// error
				}
				var info = JSON.parse(this.userInfo)
				if (info.role == "user") {
					console.log("普通用户")
					this.open()
				}else{
					if (this.username == '' || this.tel == '' || this.address == '') {
						uni.showToast({
							title: '不能为空',
							icon: 'none'
						})
					} else {
						uni.request({
							url: "http://dsx.cdzer.com/api/Circle/activities_apply", //仅为示例，并非真实接口地址。
							data: {
								username: this.username,
								tel: this.tel,
								com_name: this.com_name,
								email: this.email,
								address: this.address,
								circle_class_id: this.flId,
								circle_id: this.circle_id,
								uid: info.id
							},
							header: {
								'content-type': 'application/x-www-form-urlencoded',
							},
							method: 'POST',
							success: (res) => {
								console.log(res, "包名")
								if (res.data.status == 200) {
									uni.showToast({
										title: res.data.mess
									})
									this.username = ''
									this.tel = ''
									this.com_name = ''
									this.email = ''
									this.address = ''
									setTimeout(()=>{
										uni.navigateBack({
											delta:1
										})
									},1000)
								} else {
									uni.showToast({
										title: res.data.mess,
										icon: 'none'
									})
								}
							}
						});
					}
				}
				// this.$http.activities_apply({
				// 	 // shop_id,
				// username:this.username,
				// tel:this.tel,
				// com_name:this.com_name,
				// email:this.email,
				// address:this.address,
				// circle_class_id:this.flId,
				// circle_id:this.circle_id,
				// token:'84d805e9b729e5f9b5947b20eefa15a510d4c848',
				// }).then(res=>{
				// 	 console.log(res)
				// 	 if(res.status == 200){
				// 		 this.info = res.data

				// 		 uni.setNavigationBarTitle({
				// 			title:this.info.shop_name
				// 		 })
				// 	 }
				// }).catch(err=>{

				// }) 

				
			}
		}
	}
</script>

<style lang="scss" scoped>
	.bttm {
		width: 690upx;
		height: 88upx;
		background: #FF3D3D;
		border-radius: 8upx;
		position: absolute;
		bottom: 100upx;
		left: 30upx;
		color: #FFFFFF;
		text-align: center;
		line-height: 88upx;
	}

	.content {
		width: 690upx;
		// height: 765upx;
		margin: 0 auto;
		background-color: #FFFFFF;
		margin-top: 20upx;
		border-radius: 15upx;
		padding: 30upx 20upx;

		view {
			width: 100%;
			height: 140upx;
			border-bottom: 2upx solid #F5F5F5;
			display: flex;
			flex-direction: column;
			justify-content: space-around;
		}
	}

	.down {
		width: 690upx;
		height: 120upx;
		margin: 0 auto;
		background-color: #FFFFFF;
		margin-top: 20upx;
		border-radius: 15upx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 30upx;
	}
</style>
